<template>
  <el-dialog
    :model-value="dialogVisible"
    title="查询结果"
    width="1000"
    :before-close="close"
  >
    <el-table max-height="400" :data="searchList" border style="width: 100%">
      <el-table-column prop="user_name" label="姓名" width="150" />
      <el-table-column prop="user_dept" label="部门" width="400">
        <template #default="{ row }">
          <div class="dept-cell">{{ row.user_dept }}</div>
        </template>
      </el-table-column>
      <el-table-column prop="userAddress" label="所在位置" />
      <el-table-column label="操作" width="80">
        <template #default="{ row }">
          <el-button type="primary" size="small" @click="goAddress(row)">
            跳转
          </el-button>
        </template>
      </el-table-column>
    </el-table>
    <template #footer>
      <span class="dialog-footer">
        <el-button @click="close">关 闭</el-button>
      </span>
    </template>
  </el-dialog>
</template>

<script setup>
const router = useRouter();
const route = useRoute();
const props = defineProps({
  dialogVisible: {
    type: Boolean,
    default: false
  },
  searchList: {
    type: Array,
    default: () => []
  }
});

const emits = defineEmits();

function close() {
  emits('close');
}

// 跳转座位
function goAddress(row) {
  let linkMethod = router.push;
  if (route.name === 'CustomSeatsDetail') {
    linkMethod = router.replace;
  }
  linkMethod({
    name: 'CustomSeatsDetail',
    query: {
      parent_node_id: row.parent_node_id,
      node_label: row.userAddress,
      active_node_id: row.nodeId
    }
  });
  close();
}
</script>

<style lang="scss" scoped>
.dept-cell {
  white-space: pre;
}
</style>
